 XPages Extension Library Mobile Controls - 「Mobile Switch」 |
この記事では、XPages Extension Library Mobile Controls から Mobile Switch コントロールを解説します。
|
ShowTable of Contents
Mobile Switch コントロールの概説
このコントロールはチェックの有無やオン／オフを切り替えるスイッチとして使用するコントロールでです。
生成されるタグ
このコントロールのタグは xe:djxmSwitch です。
<xe:djxmSwitch leftLabel="ON" rightLabel="OFF" id="djxmSwitch1">
</xe:djxmSwitch>
Mobile Switch のプロパティ
|
カテゴリ |
プロパティ |
説明 |
|
イベント |
onStateChanged |
スイッチによって内容が変わった際のイベント |
|
|
onTouchEnd |
ユーザーがスイッチを押し、その指を離した際のイベント |
|
|
onTouchMobe |
ユーザーがスイッチを押し、その指を移動させている際のイベント |
|
|
onTouchStart |
ユーザーがスイッチに指を触れたときのイベント |
|
基本 |
leftLabel |
スイッチの左側のラベルテキスト
|
|
|
rightLabel |
スイッチの右側のラベルテキスト |
|
|
value |
スイッチの初期値。デフォルトはON |
このスイッチコントロールの設定内容の変更には onStateChanged イベントで以下のようなスコープ変数(ここでは viewScope)とJavaScript を使用して次のページなどに値を渡すことが多い。
<xe:djxmSwitch leftLabel="ON" rightLabel="OFF"
id="djxmSwitch1">
<xe:this.onStateChanged><![CDATA[#{javascript:var v = viewScope.config1;
if (v!=="off") {
viewScope.put("config1","off");
} else{
viewScope.put("config1", "on");
}
}]]></xe:this.onStateChanged>
</xe:djxmSwitch>
|